<!-- 单图组 -->
<template>
	<view class="diy-imageSingle" :style="[{'padding-bottom': paddingTop},{'background': background}]">
		<view class="item-image" v-for="(dataItem,index) in dataList" :key='index' :style="[{'padding-top': paddingTop},{'padding-left':paddingLeft},{'padding-right':paddingLeft},{'padding-bottom': paddingbottom}]">
			<view class="nav-to" @tap="menuClick" :data-url="dataItem.linkUrl">
				<image :src="dataItem.imgUrl" mode="widthFix"></image>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		computed: {
			paddingTop() {
				return uni.upx2px(this.itemStyle.paddingTop*2) + 'px';
			},
			background() {
				return this.itemStyle.background;
			},
			paddingLeft() {
				return uni.upx2px(this.itemStyle.paddingLeft*2) + 'px';
			},
			paddingbottom() {
				return uni.upx2px(0) + 'px';
			}
		},
		props: {
			// itemIndex:{},
			itemStyle: {},
			params: {},
			dataList: {}
		},
		methods: {
			//跳转
			menuClick(e) {
				let url = e.currentTarget.dataset.url;
				
				if (url == '') {
					return
				}else if(url.substring(0,4) == 'page'){
					return this.navigationTo({
					//只能跳转到程序内页面
					url: url
					});
				}else{
					return this.openBrowser(url)
				}
			},
		}
	}
</script>

<style>
	.diy-imageSingle .item-image image {
		display: block;
		width: 100%;
	}
</style>
